package myJs.user.detailInfo

import myJs.CpLayer
import myJs.admin.Admin
import myJs.api.Api
import myJs.cps.Style
import myJs.tool.Tool
import myJs.user.User
import org.scalajs.macrotaskexecutor.MacrotaskExecutor.Implicits._
import shared.pojo.Pojo.{AdminData, UserData, UserRowData}
import shared.pojo.User.{PdfInfo, UserIdData}
import slinky.core.FunctionalComponent
import slinky.core.annotations.react
import slinky.core.facade.Hooks.{useEffect, useState}
import slinky.web.html._

@react object Cp {

  val curPage = DetailInfo

  type Props = Unit

  val component = FunctionalComponent[Props] { props =>
    val (user, setUser) = useState(UserRowData())
    val (pdfInfo, setPdfInfo) = useState(PdfInfo())
    val (modifyPdfInfoShow, setModifyPdfInfoShow) = useState(false)
    object FTool {

      def refreshPdfInfo = () => {
        val request = UserIdData(id = Tool.getUserId)
        Api.user.getPdfInfo(request).map { x =>
          setPdfInfo(x)
        }
      }

      def refreshUser = () => {
        val request = UserIdData(id = Tool.getUserId)
        Api.user.detailInfo(request).map { curData =>
          setUser(curData)
        }
      }

      def updateShow = () => {
        setModifyPdfInfoShow(true)
        ()
      }

      def modifyPdfInfoShowChange = (v: Boolean) => {
        setModifyPdfInfoShow(v)
      }

    }

    useEffect(
      () => {
        FTool.refreshUser()
      },
      List()
    )

    useEffect(
      () => {
        FTool.refreshPdfInfo()
      },
      List()
    )

    CpLayer(title = curPage.titleStr)(
      div(
        className := "page-content",
        div(
          className := "page-bar",
          ul(
            className := "page-breadcrumb",
            li(
              i(className := "fa fa-user"),
              " ",
              a(href := "#", "账户信息")
            )
          )
        ),
        div(
          className := "row-fluid",
          div(
            className := "row",
            div(
              className := "col-md-12 col-sm-12",
              div(
                className := "portlet blue-madison box",
                div(className := "portlet-title", div(className := "caption", "账户信息")),
                div(
                  className := "portlet-body form",
                  form(
                    className := "form-horizontal",
                    style := Style(marginTop = 30),
                    div(
                      className := "form-body",
                      h3(className := "form-section", "基本信息"),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "用户名:"),
                        div(
                          className := "col-sm-3",
                          p(className := "form-control-static", s"${user.name}")
                        ),
                        label(className := "control-label col-sm-2", "姓名:"),
                        div(
                          className := "col-sm-3",
                          p(className := "form-control-static", s"${user.fullName}")
                        )
                      ),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "密码:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(paddingRight = 8), s"******"),
                            "  ",
                            a(href := s"${User.changePassword.absolutePath}", "点击修改")
                          )
                        ),
                        label(className := "control-label col-sm-2", "单位:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(paddingRight = 8), s"${user.unit} ")
                          )
                        )
                      ),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "邮箱:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(paddingRight = 8), s"${user.email} ")
                          )
                        ),
                        label(className := "control-label col-sm-2", "手机:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(), s"${user.phone} ")
                          )
                        )
                      ),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "有效次数:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(
                              style := Style(paddingRight = 8),
                              s"${user.remainTimes.getOrElse("不限")} "
                            )
                          )
                        ),
                        label(className := "control-label col-sm-2", "有效期限:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(
                              style := Style(),
                              s"${user.startTime.getOrElse("不限")} 至 ${user.endTime.getOrElse("不限")} "
                            )
                          )
                        )
                      ),
                      h3(className := "form-section", "报告相关"),
                      div(
                        className := "form-group",
                        style := Style(marginTop = -15),
                        div(
                          className := "col-sm-5",
                          button(
                            `type` := "button",
                            className := "btn btn-primary",
                            onClick := FTool.updateShow,
                            i(className := "fa fa-pencil", " 修改信息")
                          )
                        )
                      ),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "标题:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(paddingRight = 8), s"${pdfInfo.title} ")
                          )
                        ),
                        label(className := "control-label col-sm-2", "送检单位:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(), s"${pdfInfo.unit} ")
                          )
                        )
                      ),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "地址:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(paddingRight = 8), s"${pdfInfo.address} ")
                          )
                        ),
                        label(className := "control-label col-sm-2", "检验人:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(), s"${pdfInfo.reporter} ")
                          )
                        )
                      ),
                      div(
                        className := "form-group",
                        label(className := "control-label col-sm-2", "审核人:"),
                        div(
                          className := "col-sm-3",
                          p(
                            className := "form-control-static",
                            span(style := Style(paddingRight = 8), s"${pdfInfo.checker} ")
                          )
                        )
                      )
                    )
                  ),
                  ModifyPdfInfoCp(
                    refreshRow = FTool.refreshPdfInfo,
                    show = modifyPdfInfoShow,
                    showChange = FTool.modifyPdfInfoShowChange,
                    row = pdfInfo
                  )
                )
              )
            )
          )
        )
      )
    )

  }

}
